<!--
  @author nowind
  @since 17/07/23 14:34
-->
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="common/common::jscss2"/>
<title>新增或编辑产品</title>
</head>
<body>
<div class="layui-fluid">

    <div class="layui-card">

        <div class="layui-card-body">

            <form method="post" action="" class="layui-form" lay-filter="zmn-form">

                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">平台：</label>
                    <div class="layui-input-inline">
                        <select id="plat" name="plat" lay-filter="plat" lay-search lay-verify="required">
                            <option value="">-选择-</option>
                            <option th:each="item:${platList}"
                                    th:value="${item.key}"
                                    th:text="${item.value}">
                            </option>
                        </select>
                    </div>
                </div>

                <hr class="layui-bg-gray">

                <div class="layui-split">&nbsp;</div>
                <div class="layui-form-item" id="servCategDiv">

                </div>

                <div class="layui-form-item submit">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit="" lay-filter="zmn-form-submit">提交</button>
                        <a class="layui-btn layui-btn-primary" onclick="zmnLayUtil.closeThisIframe(parent,{reloadPage: true})">取消</a>
                    </div>
                </div>

                <div class="layui-split">&nbsp;</div>

            </form>
        </div>
    </div>
</div>
</body>
</html>
<script type="text/javascript" th:inline="javascript">
    var json = {
        ZMN_EVN: [[${ZMN_EVN}]],
    };
    layui.config({
        version: 202005151722,
        base: "/static/lay/"
    }).extend({
        index: "lib/index"
    }).use(['index', 'form', 'table', 'laypage', 'layedit', 'laytpl', 'zmnBind'], function(){
        var $ = layui.$;
        var form = layui.form;
        var layer = layui.layer;
        var table = layui.table;
        var laypage = layui.laypage;
        var layedit = layui.layedit;
        var laytpl = layui.laytpl;
        var zmnBind = layui.zmnBind;


        // let url = 'gateway-api.xiujiadian.com/plat/api/servCategory/listServCategoryVt2';
        let url = '/plat/sp/config/listServCategory';
        let body = {limitPermit: false};
        console.log("body:" + body);
        $.ajax({
            type: "POST",
            url: url,
            xhrFields: {
                withCredentials: true
            },
            contentType: "application/json",
            dataType: "json",
            data: JSON.stringify({body:body}),
            success: function (result) {

                // {"data":[{"text":"家电维修","value":1002,"status":true},{"text":"家电清洗","value":1001,"status":true},{"text":"家电安装","value":1003,"status":true},{"text":"管道疏通","value":1004,"status":true},{"text":"水电维修","value":1007,"status":true},{"text":"开锁换锁","value":1005,"status":true},{"text":"家具门窗","value":1006,"status":true},{"text":"房屋修缮","value":1008,"status":true},{"text":"商用电器","value":1012,"status":true},{"text":"商品销售","value":1011,"status":true},{"text":"清洁杀菌","value":1020,"status":true}],"success":true,"status":200}
                let items = result.data;
                let html = '';
                for(let item of items){
                    let servCategHtml = `<div class="layui-inline">
                                        <label class="layui-form-label">${item.text} :</label>
                                        <div class="layui-inline" style="width: 100px;">
                                            <input type="text" name="servCategStock" placeholder="库存量" oninput="value=value.replace(/[^\\d]/g,'');" maxlength="6" lay-verify="required" servCategId="${item.value}" servCategName="${item.text}" value="" autocomplete="off" class="layui-input"/>
                                        </div>
                                        <div class="layui-inline" style="width: 100px;">
                                            <input type="text" name="servCategCoefficient"  placeholder="节假日系数" maxlength="6" lay-verify="required|range" servCategId="${item.value}" servCategName="${item.text}" value="" autocomplete="off" class="layui-input"/>
                                        </div>
                                    </div>`;
                    html += servCategHtml;
                }
                $('#servCategDiv').html(html);
            }
        });

        // 自定义验证规则
        form.verify({
            range: function(value){
                if (value == null || value == undefined || value == ''){
                    return;
                }
                var reg = new RegExp("^(([1-9][0-9]*)|(([0]\\.\\d{1,1}|[1-9][0-9]*\\.\\d{1,1})))$");
                if(!reg.test(value)){
                    return "请输入正确的格式!最多保留一位小数";
                }
                if(parseFloat(value) < 0.6 || parseFloat(value) > 3){
                    return "系数值不符合规定,系数值范围0.6~3.0";
                }
            }
        });

        // 提交
        form.on('submit(zmn-form-submit)', function(obj){
            var data = obj.field;
            if(zmnUtil.isEmptyNull(data.plat)){
                layer.alert('平台不能为空!');
                return false;
            }

            let plat = data.plat;

            let servCategStock = document.getElementsByName("servCategStock");
            let servCategCoefficient = document.getElementsByName("servCategCoefficient");
            let servCategArr = new Array();
            for(var i=0; i < servCategStock.length; i++){
                let servCateg = new Object();
                servCateg["plat"] = plat;
                servCateg["servCategId"] = $(servCategStock[i]).attr("servCategId");
                servCateg["servCategName"] = $(servCategStock[i]).attr("servCategName");
                servCateg["stock"] = servCategStock[i].value;
                servCateg["coefficient"] = servCategCoefficient[i].value;
                servCategArr.push(servCateg);
            }

            var url = "/plat/config/saveBatchSet.action";
            $.ajax({
                async: false,
                type: "POST", url: url,
                contentType: "application/json", dataType: "json", data: JSON.stringify(servCategArr),
                success:function(resp) {
                    if(resp.status == 200) {
                        zmnPage.reload('操作成功!', 1000);
                    }else{
                        layer.msg(resp.message,{icon: 2});
                    }
                },
                error:function(XMLHttpRequest, status, errorThrown){}
            });
            return false;
        });
    });


    var spConfig = {
        /**
         * 多级下拉框联动
         * @param form layui.form
         * @param url1 selectOneId请求下级数据的url，返回数据格式 [[value,text], [value,text], [value,text], …]
         * @param url1 selectTwoId请求下级数据的url，返回数据格式 [[value,text], [value,text], [value,text], …]
         * @param selectOneId 第1级select的ID，不含#号
         * @param selectTwoId 第2级select的ID，不含#号
         * @param selectThrId 第3级select的ID，不含#号，如无第3级则两级联动
         */
        laySelectSpecial: function (form, url1, url2, selectOneId, selectTwoId, selectThrId, selectTwoOperator) {
            let $ = layui.$;
            form.on("select(" + selectOneId + ")", function (obj) {
                if (zmnUtil.isNull(obj) || obj.value == 0) {
                    return;
                }
                servCategId = obj.value;
                $.ajax({
                    type: "GET", url: url1,
                    dataType: "json", data: {servCategId: servCategId, cityId: cityId, spId: json.spId},
                    success: function (result) {
                        let items = result.data;
                        if (items == null) {
                            $("#" + selectTwoId).html("");
                            $("#" + selectThrId).html("");
                            form.render("select");
                            return;
                        }
                        var optionHtml = '<option value="0">选择</option>';
                        for (var i = 0; i < items.length; i++) {
                            optionHtml += '<option value="' + items[i].value + '">' + items[i].text + '</option>';
                        }
                        $("#" + selectTwoId).html(optionHtml);
                        $("#" + selectThrId).html("");
                        form.render("select");
                    }
                });
            });
            if (zmnUtil.isEmptyNull(selectThrId)) {
                return;
            }
            ;

            form.on("select(" + selectTwoId + ")", function (obj) {
                if (zmnUtil.isNull(obj) || obj.value == 0) {
                    return;
                }
                categOneId = obj.value;
                servCategId = $('#servCategId').val();
                $.ajax({
                    type: "GET", url: url2,
                    dataType: "json", data: {servCategId: servCategId, categOneId: categOneId, cityId: cityId, spId: json.spId},
                    success: function (result) {
                        let items = result.data;
                        let defaultOperator = function(){
                            if (items == null) {
                                $("#" + selectThrId).html("");
                                form.render("select");
                                return;
                            }
                            var optionHtml = '<option value="0">选择</option>';
                            for (var i = 0; i < items.length; i++) {
                                optionHtml += '<option value="' + items[i].value + '">' + items[i].text + '</option>';
                            }
                            $("#" + selectThrId).html(optionHtml);
                            form.render("select");
                        }
                        if(selectTwoOperator){
                            selectTwoOperator(items);
                        }else{
                            defaultOperator();
                        }
                    }
                });
            });
        },
        laySelectCity: function (form, url, selectOneId, selectTwoId) {
            let $ = layui.$;
            form.on("select(" + selectOneId + ")", function (obj) {
                if (zmnUtil.isNull(obj) || obj.value == 0) {
                    return;
                }
                cityId = obj.value;
                $.ajax({
                    type: "GET", url: url,
                    dataType: "json", data: {cityId: cityId, spId: json.spId},
                    success: function (result) {
                        let items = result.data;
                        var optionHtml = '<option value="0">选择</option>';
                        for (var i = 0; i < items.length; i++) {
                            optionHtml += '<option value="' + items[i].categId + '">' + items[i].name + '</option>';
                        }
                        $("#" + selectTwoId).html(optionHtml);
                        $("#categOneId").html("");
                        $("#categId").html("");
                        form.render("select");
                    }
                });
            });
        }
    }

</script>